.divider, .harbarg, .matn-ax { display: flex; } .divider { align-items: center; justify-content: center; } .line { height: 2px; background-color: #b09932; flex-grow: 1; } .line-left { margin-left: 10vw; } .line-right { margin-right: 10vw; } .icon { margin: 0 20px; width: 40px; } .firstcard { transition: 0.8s; } .firstcard:hover { color: #f7d65a !important; cursor: default; } @media screen and (min-width: 1250px) { .firstcard { font-size: 1.4rem; } } /*.firstcard { font-size: calc(1rem + 0.4vw); }*/ .bache { flex: 1; color: #846e0a; } @media screen and (max-width: 768px) { .bache > h3 { font-size: 2.5rem; } } .baba-ax { background-size: cover; width: 100%; height: 300px; position: relative; overflow: hidden; } #baba-ax1{ background-image: url(./ax3.jpg);} #baba-ax2{background-image: url(./ax-35.jpg);} #baba-ax3{background-image: url(./ax-37.jpg);} .matn-ax { width: 100%; position: absolute; bottom: -25px; height: 0; opacity: 0.7; background-color: #fffbfb; text-align: center; transition: 1s; justify-content: center; align-items: center; } .glasscard { border-radius: 16px; background: rgba(255, 255, 255, 0.1); box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(4.5px); -webkit-backdrop-filter: blur(5px); border: 1px solid rgba(255, 255, 255, 0.3); position: relative; overflow: hidden; } .rangicard { transition: 1.4s; border-radius: 16px; background-color: #e1c661; width: 0; position: absolute; right: -50%; top: 0; bottom: 0; height: 100%; z-index: -1; }